<% include ../header.ejs %>


<link rel="stylesheet" href="/stylesheets/app/address/address.css">
<link rel="stylesheet" href="/lib/jquery/autocomplete/css/styles.css">
<script src="/lib/jquery/autocomplete/js/jquery.autocomplete.min.js"></script>

<header data-am-widget="header" data-am-sticky class="am-header am-header-default" id="appTemplates-Nav">
    <div class="am-header-left am-header-nav">
        <a href='javascript:history.go(-1)' class="">
            <img class="am-header-icon-custom" src="data:image/svg+xml;charset&#x3D;utf-8,&lt;svg xmlns&#x3D;&quot;http://www.w3.org/2000/svg&quot; viewBox&#x3D;&quot;0 0 12 20&quot;&gt;&lt;path d&#x3D;&quot;M10,0l2,2l-8,8l8,8l-2,2L0,10L10,0z&quot; fill&#x3D;&quot;%23fff&quot;/&gt;&lt;/svg&gt;" alt=""/>
        </a>
    </div>
    <h1 class="am-header-title">
        <a href="#title-link" class="" id="Typeface-whitecolor">联系人</a>
    </h1>

    <div class="am-header-right am-header-nav">
        <a id="custom-edit-button" onClick="actionClick('<%=action%>')">
            <span class="am-header-nav-title" id="txtHeadButton">
                <%if(action=='add'){%>
                保存
                <%}else if(action=='detail'){%>
                编辑
                <%}%>
            </span>
        </a>
    </div>
</header>
<% function ifNull(obj,res) {
    return (obj == null || obj == '')?"":obj[res];
}%>
<form  id = "editAddressbook" class="am-form" method="post" action="add" data-am-validator>
    <input type="hidden" name = "action" value="<%=action%>">
    <input type="hidden" name = "rowId" value="<%=ifNull(addressbook,'rowId')%>">
<!--<form class="am-form" style="margin: 2%" data-am-validator>-->
    <fieldset disabled id="formFS">
    <div class="am-form-group">
        <label for="doc-vld-name">姓名：</label>
        <input type="text"  id="doc-vld-name" name = "name" placeholder="姓名" required autocomplete="off"  value="<%=ifNull(addressbook,'name')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-company">公司：</label>
        <input type="text"  id="doc-vld-company"  name = "company" placeholder="公司" required value="<%=ifNull(ifNull(addressbook,'company'),'name')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-department">角色：</label>
        <input type="text"  id="doc-vld-department"  name = "department" placeholder="角色"  value="<%=ifNull(ifNull(addressbook,'department'),'name')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-phone">手机：</label>
        <input type="text"  id="doc-vld-phone"  name = "phone" placeholder="手机" autocomplete="off" required value="<%=ifNull(addressbook,'phone')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-mail">邮箱：</label>
        <input type="text"  id="doc-vld-mail"  name = "email" placeholder="邮箱" autocomplete="off" value="<%=ifNull(addressbook,'email')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-tel">总机：</label>
        <input type="text"  id="doc-vld-tel"  name = "tel" placeholder="总机" autocomplete="off" value="<%=ifNull(addressbook,'tel')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-extension">分机：</label>
        <input type="text"  id="doc-vld-extension"   name = "extension" placeholder="分机" autocomplete="off" value="<%=ifNull(addressbook,'extension')%>"/>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-industry">行业：</label>
        <select multiple id="doc-vld-industry" name="industry" data-am-selected="{btnWidth:'100%'}" placeholder="选择行业" required >
            <%
            var industrys = ifNull(ifNull(addressbook,'industry'),'industryName')==''?[]:addressbook.industry.split(",");
                industryList.forEach(function (data, index) {

            %>
            <option value="<%=data.industryName%>" <%industrys.forEach(function (res,i){if((index==0 && action =='add')||(action =='detail' && data.industryName == res)){%>selected<% } })%>><%=data.industryName%></option>

            <% })%>
        </select>
    </div>
    <div class="am-form-group">
        <label for="doc-vld-position">职位：</label>
        <input type="text"  id="doc-vld-position"  name = "position" placeholder="职位" autocomplete="off" value="<%=ifNull(addressbook,'position')%>"/>
    </div>
     <!--<button class="am-btn am-btn-secondary" type="submit" id="save"  style="display:none">保存</button>-->
    <div id="divAction" style="display:none">
        <button class="am-btn am-btn-danger" type="button" id="btndel" onclick="delContact()">删除</button>
        <button class="am-btn am-btn-secondary" type="button" id="btnSave" onclick="editContact()">保存</button>
    </div>

    </fieldset>
</form>



<div class="am-modal am-modal-prompt" tabindex="-1" id="alert-prompt">
    <div class="am-modal-dialog">
        <div class="am-modal-hd">提示</div>
        <div class="am-modal-bd">
            <label id="lbMsg"></label>
        </div>
        <div class="am-modal-footer">

            <span class="am-modal-btn" data-am-modal-confirm>确定</span>
        </div>
    </div>
</div>





<script>

    <%if(action=='detail'&&typeof addressbook != 'undefined' ){%>
        var isEdit=false;
    <%}else{%>
        var isEdit=true;
        $('#formFS').attr("disabled",false);
    <%}%>

    $("#doc-vld-company").autocomplete({
        serviceUrl: '/smtool_project/wxapp/addressbook/companySearch',
        showNoSuggestionNotice: true,
        minChars: 1,
        maxHeight:300,
        noSuggestionNotice: '暂无相关公司信息',
        onSelect: function (data) {

        }
    });
    $("#doc-vld-department").autocomplete({
        serviceUrl: '/smtool_project/wxapp/addressbook/deptSearch',
        showNoSuggestionNotice: true,
        minChars: 1,
        maxHeight:300,
        noSuggestionNotice: '暂无相关角色信息',
        onSelect: function (data) {

        }
    });
    function actionClick(action) {
        if (action == 'add') {
            $.post("/smtool_project/wxapp/addressbook/add",
                $("#editAddressbook").serialize()
                ,function(data,status){
                console.log(data)
                    if(data.code == '200'){
                        showMsg("添加成功")
                    }else{
                        showMsgNoRefresh("添加失败");
                    }

            });
        } else if (action = 'edit') {

            if (isEdit) {
                isEdit = false;
                $("#txtHeadButton").text("编辑");
                //hideButton
                showButton(false);
//                reset();
                $('#formFS').attr("disabled", true);
            }
            else {
                isEdit = true;
                $("#txtHeadButton").text("取消");
                //showButton
                showButton(true);
                $('#formFS').attr("disabled", false);
            }
        }
//        }
    }
    function showButton(isVisible){
        $('#divAction').toggle(200);
    }

    function showMsgNoRefresh(msg){
        $('#lbMsg').text(msg);

        $('#alert-prompt').modal({
            relatedElement: this,
            onConfirm: function (e) {


                return false;
            },
            onCancel: function () {


            }
        });


    }

    function showMsg(msg){

        $('#lbMsg').text(msg);

        $('#alert-prompt').modal({
            relatedElement: this,
            onConfirm: function (e) {

                self.location="index"
                return false;
            },
            onCancel: function () {


            }
        });
    }


    function delContact(){
        var rowId = '<%=ifNull(addressbook,'rowId')%>';
        $.post("/smtool_project/wxapp/addressbook/del",
            {'rowId':rowId}
            ,function(data,status){
                console.log(data)
                if(data.code == '200'){
                    showMsg("删除成功")
                }else{
                    showMsgNoRefresh("删除失败");
                }

            });
    }

    function editContact(){console.log(1)
        //判断内容是否改动

        $.post("/smtool_project/wxapp/addressbook/add",
            $("#editAddressbook").serialize()
            ,function(data,status){
                console.log(data)
                if(data.code == '200'){
                    showMsg("修改成功")
                }else{
                    showMsgNoRefresh("修改失败");
                }

            });
            return false;
    }
</script>

<% include ../footer.ejs %>